<template>
    <view class="disease ph-64 pv-64">
        <Navigation title="疾病自查" background="#fff" />
        <view class="f jc-c fs-32 fw-600 text-color4">选择宠物</view>
        <view class="box w-622 b-12 ph-28 mt-20">
            <view class="f ai-c jc-s-b pt-28 pb-25 line" v-for="(item, index) in list" :key="index">
                <view class="f ai-c">
                    <image :src="item.avatar" class="w-100 h-100 b-12 mr-20"></image>
                    <view>
                        <view class="fs-28 fw-600 text-color1">{{ item.name }}</view>
                        <view class="fs-24 text-color3 mt-4">{{ item.secondCategoryName }}/{{ item.gender == 1 ? 'GG' : 'MM' }}/{{ item.age }}岁</view>
                    </view>
                </view>
                <view class="w-120 h-56 f ai-c jc-c b-56 select fs-26 text-color" @click="toSelect(item)">选择</view>
            </view>
            <view class="f jc-c pt-20 pb-24 ai-c" @click="toAddPet">
                <image src="http://cwht.ricecs.cn/app/mine/add.png" class="w-32 h-32 mr-12"></image>
                <view class="fs-28 text-color">添加新宠物</view>
            </view>
        </view>
    </view>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { onShow } from '@dcloudio/uni-app';
import { mypetProfile } from '@/services/api/pet';
const list = ref<any[]>([]);
onShow(() => {
    getPet();
});
//获取宠物
async function getPet() {
    const { data } = await mypetProfile({});
    list.value = data;
}
const toSelect = (data: any) => {
	uni.setStorageSync('disease',data)
    uni.navigateTo({
        url: `/pages_index/diseaseDetail/index?petId=${data.id}&name=${data.name}&firstCategoryId=${data.firstCategoryId}`,
    });
};
function toAddPet() {
    uni.navigateTo({
        url: '/pages_mine/addPet',
    });
}
</script>
<style lang="scss" scoped>
.disease {
    .line {
        border-bottom: 1rpx solid #dddddd;
    }
    .select {
        border: 1rpx solid #fabb3c;
    }
    .box {
        border: 1rpx solid #dddddd;
    }
}
</style>
